<template>
	<view class="app_Cont">
		<scroll-view class="showCont" scroll-y="true" @scrolltolower="scrolltolower" lower-threshold="10" v-if="showCont">
			<view class="headCar" @click="toEditCom">
				<view class="carInfo">
					<view class="comName">{{menberData.enterprise_name}}</view>
					<view class="comTel" >
						<view class="iconfont icon-24gl-phoneLoudspeaker"></view>
						<view class="telNum">{{menberData.enterprise_person}} · {{menberData.enterprise_mobile}}</view>
					</view>
					<view class="comTel" v-if="menberData.enterprise_address">
						<view class="iconfont icon-dizhi"></view>
						<view class="telNum">{{menberData.enterprise_address}}</view>
					</view>
				</view>
				<view class="comImg">
					<image :src="menberData.enterprise_logo"></image>
				</view>
			</view>
			<view class="comWork">
				<view class="serchNav">
					<view class="serchLeft" @click="navFn(item)" :key="index" v-for="(item,index) in navArr">
						<view class="shuTag" v-if="navId==item.id"></view>
						<view :class="navId==item.id?'serchLeftText_':'serchLeftText'">{{item.name}}</view>
					</view>
				</view>
				<view class="workCont" v-if="navId==1">
					<view class="workItem" :key="index" v-for="(item,index) in listArr">
						<view class="workHead" @click="detailFn(item)">
							<view class="workNameInfo">
								<view class="workName" v-if="item.watercraft_area">{{item.watercraft_area}}</view>
								<view class="headShu" v-if="item.watercraft_area"></view>
								<view class="workName">{{item.position_name}}</view>
								<view class="workTag" v-if="item.position_type==2">急聘</view>
							</view>
							<view class="workMoney">
								<text v-if="item.start_monry=='0'">面议</text>
								<text v-else>{{item.start_monry}}~{{item.end_monry}}{{item.unit==1?'元':'美元'}}</text>
							</view>
						</view>
						<view class="workInfo" @click="detailFn(item)">
							<view class="workDes">
								<view class="workDesItem" v-if="item.watercraft_num">{{item.watercraft_num}}{{item.watercraft_dw}}</view>
								<view class="workDesItem" v-if="item.watercraft_type">{{item.watercraft_type}}</view>
							</view>
						</view>
						<view class="workTags" @click="detailFn(item)">
							<view class="tagItem" v-if="item.zsdj">{{item.zsdj}}</view>
							<view class="tagItem" v-if="item.gzjy">{{item.gzjy}}</view>
							<view class="tagItem" v-if="item.xlyq">{{item.xlyq}}</view>
							<view class="tagItem" v-if="item.nlyq">{{item.nlyq}}</view>
							<view class="tagItem" v-if="item.gwfl" :key="index2" v-for="(item2,index2) in item.gwfl.split(',')">{{item2}}</view>
						</view>
						<view class="itemBtnCont">
							<view class="deleteBtn" @click="deleteFn(item,index)">
								<view class="iconfont icon-shanchu"></view>
								<view>删除岗位</view>
							</view>
							<view class="deleteBtn editBtn" @click="editFn(item)">
								<view class="iconfont icon-bianji"></view>
								<view>编辑岗位</view>
							</view>
						</view>
					</view>
					<noData v-if="listArr.length==0&&!isChange"></noData>
					<loadMore v-if="!isChange&&last_page==page"></loadMore>
				</view>
				<view class="bootComt" v-if="navId==2">
					<view class="bookItem" :key="index" v-for="(item,index) in listArr">
						<view class="bootTop">
							<view class="bookHead" @click="detailFn(item)">
								<view class="bookHeadLeft">
									<view class="bookName">投递岗位·{{item.position_name}}</view>
									<view class="workTag" v-if="item.is_read==1">未读</view>
								</view>
								<view class="workMoney">{{item.type==1?item.qwyx+'美元':item.qwyx}}</view>
							</view>
							<view class="bookTags" @click="bootDetailFn(item)">
								<view class="bookTagsItem">{{item.zs}}</view>
								<view class="bookTagsItem">{{item.cblx=='均可'?'船型均可':item.cblx}}</view>
								<view class="bookTagsItem">{{item.hxyq=='均可'?'航线均可':item.hxyq}}</view>
							</view>
							<view class="bookOtherInfo" @click="bootDetailFn(item)">
								<view class="itemDes">
									<view class="iconfont icon-xueli"></view>
									<view>{{item.xl}}</view>
								</view>
								<view class="itemDes">
									<view class="iconfont icon-gongzuojingyan"></view>
									<view>{{item.gzjy}}<text v-if="item.type==1">年</text>经验</view>
								</view>
								<view class="itemDes noRight flex_Pull">
									<text class="iconfont icon-purseS-fill"></text>
									<text class="overText">{{item.jg}}</text>
								</view>
							</view>
						</view>
						<view class="bootUnder" @click="bootDetailFn(item)">
							<view class="comLeft">
								<view class="comImg iconfont icon-chuanyuanzhaopin">
									
								</view>
								<view class="comInfo">
									<view class="comInfoTop">
										{{item.real_name}} · {{item.age}}岁
									</view>
								</view>
							</view>
							<view class="workTime">投递时间 {{item.create_time}}</view>
						</view>
					</view>
					<noData v-if="listArr.length==0&&!isChange"></noData>
					<loadMore v-if="!isChange&&last_page==page"></loadMore>
				</view>
			</view>
		</scroll-view>
		<subLoad v-if="showSub"></subLoad>
		<load v-if="!showCont||isChange"></load>
		<u-modal :show="showModal" :showCancelButton="true" @cancel="showModal = false" title="温馨提示" @confirm="modalSure"  :content='modalCont'></u-modal>
	</view>
</template>

<script>
	import api from '@/http/api.js'
	import noData from '@/components/noData.vue'
	import subLoad from '@/components/sub.vue'
	import load from '@/components/load.vue'
	import loadMore from '@/components/loadMore.vue'
	export default {
		components:{load,noData,loadMore,subLoad},
		data() {
			return {
				showCont:false,
				showSub:false,
				showModal:false,
				modalCont:'确定要删除此岗位吗？',
				menberData:'',
				navArr:[
					{name:'发布岗位',id:1},
					{name:'收到投递',id:2},
				],
				navId:1,
				page:1,
				per_page:10,
				last_page:0,
				isChange:false,
				listArr:[],
				deleteIndex:'',
				deleteItem:{}
			};
		},
		methods:{
			deleteFn(item,index){
				this.deleteItem = item
				this.deleteIndex = index
				this.showModal = true
			},
			editFn(item){
				uni.navigateTo({
					url: '../sendWork/sendWork?id='+item.enterprise_position_id
				});
			},
			modalSure(){
				let data = {
					enterprise_position_id:this.deleteItem.enterprise_position_id
				}
				this.showModal = false
				this.showSub=  true
				api.getRequst(data,'/api/My/delPosition').then((res)=>{
					this.showSub=  false
					if(res.code==1){
						uni.showToast({
							title: '删除成功',
							icon: 'none'
						});
						this.listArr.splice(this.deleteIndex,1)
					}
				})
			},
			toEditCom(){
				uni.navigateTo({
					url: '../vip/signCom/signCom'
				});
			},
			navFn(item){
				this.navId = item.id
				this.page = 1
				this.last_page = 0
				this.isChange = true
				this.listArr = []
				this.getData()
			},
			scrolltolower(){
				if(this.page<this.last_page){
					
					this.page++
					this.isChange = true
					this.getData()
				}
			},
			
			detailFn(item){
				uni.navigateTo({
					url: '../../index/workDetail/workDetail?id='+item.enterprise_position_id
				});
			},
			bootDetailFn(item){
				if(item.is_read==1){
					let data = {
						user_position_deliver_id:item.user_position_deliver_id
					}
					// this.showSub=  true
					api.getRequst(data,'/api/My/checkRead').then((res)=>{
						// this.showSub=  false
						if(res.code==1){
							item.is_read = 2
							uni.navigateTo({
								url: '../bootDetail/bootDetail?id='+item.biographical_notes_id
							});
						}
					})
				}else{
					uni.navigateTo({
						url: '../bootDetail/bootDetail?id='+item.biographical_notes_id
					});
				}
			},
			getData(){
				let data = {
					page:this.page,
					per_page:this.per_page,
				}
				let url = ''
				if(this.navId==1){
					url = '/api/My/fbPosition'
				}else if(this.navId==2){
					url = '/api/My/positiontdRecord'
				}
				api.getRequst(data,url).then((res)=>{
					if(res.code==1){
						let arr = res.data.data
						for(let item of arr){
							this.listArr.push(item)
						}
						this.last_page = res.data.last_page
					}
					this.isChange = false
				})
			},
			getMenber(){
				let data = {}
				api.getRequst(data,'/api/Crew/getData').then((res)=>{
					if(res.code==1){
						this.menberData = res.data.crew_enterprise.crew_enterprise
					}
					this.showCont = true
				})
			},
		},
		async onLoad(option) {
			this.navId = option.navId||1
			await this.getMenber()
			this.getData()
		}
	}
</script>

<style lang="less">
.showCont{
	padding-top: 30rpx;
	box-sizing: border-box;
	height: 100vh;
	background-color: #f6f7f9;
	overflow-y: auto;
	.headCar{
		width: 92%;
		background-image: linear-gradient(to right bottom,#89afff,#3f55cc);
		margin: 0 auto;
		padding: 30rpx;
		box-sizing: border-box;
		border-radius: 30rpx;
		color: #fff;
		display: flex;
		align-items: flex-start;
		.carInfo{
			width: 100rpx;
			flex: 1;
			.comName{
				font-weight: bold;
				font-size: 32rpx;
				width: 100%;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
			}
			.comTel{
				display: flex;
				align-items: center;
				margin-top: 15rpx;
				.iconfont{
					margin-right: 15rpx;
				}
				.telNum{
					width: 100rpx;
					flex: 1;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
			}
		}
		.comImg{
			width: 120rpx;
			height: 120rpx;
			background-color: #fff;
			padding: 3rpx;
			box-sizing: border-box;
			border-radius: 10rpx;
			overflow: hidden;
			image{
				width: 100%;
				height: 100%;
				border-radius: 10rpx;
			}
		}
	}
	.comWork{
		width: 100%;
		padding: 30rpx 4%;
		box-sizing: border-box;
	}
	.serchNav{
		display: flex;
		// justify-content: space-between;
		align-items: center;
		margin-top: 20rpx;
		.serchLeft{
			display: flex;
			position: relative;
			margin-right: 50rpx;
			font-size: 30rpx;
			.serchLeftText{
				position: relative;
				z-index: 2;
				font-weight: bold;
				color: #000;
			}
			.serchLeftText_{
				color: #3f55cc;
			}
			.shuTag{
				height: 10rpx;
				position: absolute;
				bottom: 0;
				left: 0;
				width: 120rpx;
				background-image: linear-gradient(to right,white,#3f55cc);
			}
		}
	}
	.workCont{
		width: 100%;
		padding-top: 10rpx;
		.workItem{
			background-color: #fff;
			padding: 30rpx 4% 20rpx;
			margin-top: 30rpx;
			border-radius: 10rpx;
			box-sizing: border-box;
			.workHead{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.workNameInfo{
					display: flex;
					align-items: center;
					.workName{
						font-size: 32rpx;
						font-weight: bold;
					}
					.headShu{
						width: 4rpx;
						border-radius: 4rpx;
						background-color: #333;
						height: 24rpx;
						margin: 0 15rpx;
					}
					.workTag{
						padding: 5rpx 20rpx;
						font-size: 24rpx;
						// border: 1px solid #f56c6c;
						// background-color: ;
						background-image: linear-gradient(to right, #f56c6c,#ebc0b4);
						color: #fff;
						// margin-left: 10rpx;
						border-radius: 20rpx 0 20rpx 0;
						transform: scale(0.85);
					}
				}
				.workMoney{
					color: #3f55cc;
					font-size: 30rpx;
				}
			}
			.workTags{
				display: flex;
				// margin: 10rpx 0;
				flex-wrap: wrap;
				.tagItem{
					margin-bottom: 15rpx;
					padding: 5rpx 20rpx;
					background-color:#dae3fb;
					color: #3f55cc;
					font-size: 26rpx;
					border-radius: 0rpx 25rpx 0rpx 0rpx;
					margin-right: 20rpx;
				}
			}
			.itemBtnCont{
				display: flex;
				align-items: center;
				padding: 30rpx 0;
				justify-content: flex-end;
				.deleteBtn{
					display: flex;
					margin-left: 30rpx;
					align-items: center;
					color: #999;
					.iconfont{
						font-size: 26rpx;
						margin-right: 5rpx;
					}
				}
				.editBtn{
					color: #4e6dff;
				}
			}
			.workInfo{
				width: 100%;
				margin-bottom: 20rpx;
				.workDes{
					width: 100%;
					display: flex;
					align-items: center;
					margin: 10rpx 0;
					.workDesItem{
						font-size: 26rpx;
						color: #999;
						margin-right: 20rpx;
					}
				}
			}
		}
	}
	.bootComt{
		width: 100%;
		padding-top: 10rpx;
		.bookItem{
			// background-color: #3f55cc;
			border-radius: 30rpx;
			background-color: #fff;
			overflow: hidden;
			width: 100%;
			padding:30rpx 30rpx 25rpx;
			box-sizing: border-box;
			margin-top: 30rpx;
			.bootTop{
				.bookHead{
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: space-between;
					.bookHeadLeft{
						display: flex;
						align-items: center;
						.bookName{
							font-size: 30rpx;
							font-weight: bold;
							// margin: 0 10rpx;
							margin-right: 10rpx;
						}
						.workTag{
							padding: 5rpx 20rpx;
							font-size: 24rpx;
							// border: 1px solid #f56c6c;
							// background-color: ;
							background-image: linear-gradient(to right, #f56c6c,#ebc0b4);
							color: #fff;
							// margin-left: 10rpx;
							border-radius: 20rpx 0 20rpx 0;
							transform: scale(0.85);
						}
					}
					.workMoney{
						color: #3f55cc;
						font-size: 30rpx;
					}
				}
				.bookTags{
					display: flex;
					align-items: center;
					margin: 5rpx 0 25rpx;
					.bookTagsItem{
						margin-top: 15rpx;
						padding: 5rpx 20rpx;
						background-color:#dae3fb;
						color: #3f55cc;
						font-size: 26rpx;
						border-radius: 0rpx 25rpx 0rpx 0rpx;
						margin-right: 20rpx;
					}
					.overText{
						max-width: 250rpx;
						text-overflow: ellipsis;
						white-space: nowrap;
						overflow: hidden;
					}
				}
				.bookOtherInfo{
					display: flex;
					align-items: center;
					width: 100%;
					.itemDes{
						display: flex;
						align-items: center;
						font-size: 24rpx;
						border-right: 1px solid #666;
						color: #666;
						padding-right: 25rpx;
						margin-right: 25rpx;
						line-height: 20rpx;
						.iconfont{
							font-size: 24rpx;
							margin-right: 8rpx;
						}
					}
					.itemDes:first-child{
						margin-left: 0;
					}
					.noRight{
						border-right: none;
					}
					.flex_Pull{
						flex: 1;
						width: 100rpx;
						.overText{
							width: 100%;
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
						}
					}
				}
			}
			.bootUnder{
				display: flex;
				
				justify-content: space-between;
				align-items: center;
				padding-top: 25rpx;
				margin-top: 25rpx;
				border-top: 1px dashed #ddd;
				// background-color: #cadfff;
				// color: #666;
				.comLeft{
					display: flex;
					align-items: center;
					.comImg{
						margin-right: 20rpx;
					}
					.comInfo{
						.comInfoUnder{
							color: #666;
							margin-top: 6rpx;
							font-size: 24rpx;
							display: flex;
							align-items: center;
							.comYuan{
								margin: 0 10rpx;
							}
						}
					}
				}
				.workTime{
					color: #999;
					font-size: 24rpx;
				}
			}
			
		}
	}
}
</style>
